<%@ page import="model.ContactGroup"%>
<%@ page import="java.util.List"%>

<script type="text/javascript">
    function getXMLObject() //XML OBJECT
    {
        var xmlHttp = false;
        try {
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); // For Old Microsoft Browsers
        } catch (e) {
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); // For Microsoft IE 6.0+
            } catch (e2) {
                xmlHttp = false; // No Browser accepts the XMLHTTP Object then false
            }
        }
        if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
            xmlHttp = new XMLHttpRequest(); //For Mozilla, Opera Browsers
        }
        return xmlHttp; // Mandatory Statement returning the ajax object created
    }

    var xmlhttp = new getXMLObject(); //xmlhttp holds the ajax object

    function handleServerResponse() {
        if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {
                document.getElementById("contactList").innerHTML = xmlhttp.responseText;
            } else {
                alert("Error during AJAX call. Please try again");
            }
        }
    }
    function loadContacts(select) {
        if (select.selectedIndex != 0) {
            if (xmlhttp) {
                xmlhttp.open("GET", "ContactList?cgid="
                        + select.options[select.selectedIndex].value);
                xmlhttp.onreadystatechange = handleServerResponse();
            } else {
                alert("Your browser doesn't support AJAX. Please update it to a more recent version.");
            }
        }
    }
    
    function changeVisibility()
    {
        document.getElementById("testForm").style.visibility = "visible";
    }
</script>

<%
    List<ContactGroup> lcg = (List<ContactGroup>) request.getAttribute("groupList");
%>
<form action="ContactList" method="get">
    <select name="contactGroupSelect" onChange="loadContacts(this)">
        <%
            for (ContactGroup cg : lcg) {
        %>
        <option value="<%=cg.getId()%>"><%=cg.getName()%></option>
        <%
            }
        %>
    </select>
    <input type="submit" name="seeContactGroup" value="See Contacts"/>
</form>

<div id="contactList">
<% if(request.getAttribute("content") != null){
%><jsp:include page="contactList.jsp"/><%
} %>
</div>


<form action="newGroup.do" method="get">
    <input type="submit" name="btnNewGroup" value="New Group" /> <input
        name="newGroupName" type="text">
</form>